<!doctype html>
<html>
	<head>
		<%--<meta name="layout" content="main"/>
		--%>
		<title>Welcome to Grails</title>
	</head>
	<link rel="stylesheet" href="${resource(dir: 'extjs/resources/css', file: 'ext-all.css')}" type="text/css">
	<script type="text/javascript" src="${resource(dir: 'extjs', file: 'ext-all.js')}"></script>
	<script type="text/javascript" src="${resource(dir: 'js/admin', file: 'layout.js')}"></script>
	<script type="text/javascript">
    Ext.require(['*']);
    Ext.onReady(function() {
        Ext.QuickTips.init();
        Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));
        var viewport = Ext.create('Ext.Viewport', {
            id: 'border-example',
            layout: 'border',
            items: [
            CMS.layout.north.init(),/**south,*/ , CMS.layout.east.init(),
            Ext.create('Ext.tab.Panel', {
                region: 'center', // a center region is ALWAYS required for border layout
                deferredRender: false,
                activeTab: 0,     // first tab initially active
                items: [{
                    contentEl: 'center1',
                    title: 'Close Me',
                    closable: true,
                    autoScroll: true
                }, {
                    contentEl: 'center2',
                    title: 'Center Panel',
                    autoScroll: true
                }]
            })]
        });
        Ext.get("hideit").on('click', function(){
            var w = Ext.getCmp('west-panel');
            w.collapsed ? w.expand() : w.collapse();
        });
    });
    </script>
	<body>
    <div id="west" class="x-hide-display">
        <p>Hi. I'm the west panel.</p>
    </div>
    <div id="center2" class="x-hide-display">
    </div>
    <div id="center1" class="x-hide-display">
    </div>
    <div id="props-panel" class="x-hide-display" style="width:200px;height:200px;overflow:hidden;">
    </div>
    <div id="south" class="x-hide-display">
    </div>
	</body>
</html>
